import { type ImmerReducer, useImmerReducer } from 'use-immer';

import type { IAction, IState } from './interface';
import updateReducer from './reduce';

const initialState = {
  width: 0,
  height: 0,
  scale: 1,
  radio: 60,
  offsetX: 0,
  offsetY: 0,
  isDragging: true,
  isResizing: true,
  canvasContentStyle: {
    opacity: 0
  }
};

const reducer: ImmerReducer<IState, IAction> = (draft, action) => {
  updateReducer.dispatch(draft, action);
};

function useCanvasStore() {
  return useImmerReducer(reducer, initialState);
}

export default useCanvasStore;
